﻿@{
    ViewBag.Title = "Fotogaléria";
}
@section head {
    
    <script src="@Url.Content("~/Scripts/galleria/galleria-1.2.9.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/galleria/plugins/facebook/galleria.facebook.js")" type="text/javascript"></script>
}

    <h2>Fotogaléria</h2>

    <div class="filter-frame">
        
        <div class="filter-item">
            <div class="editor-label">
                Vyberte album
            </div>
            <div class="editor-field">
                <select id="Albums" name="Albums"></select>
            </div>
        </div>

    </div>

    <div id="galleria"></div>    

    <p>
        Fotogalériu nájdete aj na <a href="https://www.facebook.com/atletikasvk" target="_blank">Facebooku</a>.
    </p>
    
    <script type="text/javascript">
        $(document).ready(function () {

            var albumId;

            // Load albums from FB
            $.getJSON("https://graph.facebook.com/atletikasvk/albums",
            function (data) {
                var select = $("#Albums");
                select.empty();

                var fbAlbums = data.data;
                $.each(fbAlbums, function (index, albumData) {
                    if (albumData.name != 'Profile Pictures' & albumData.name != 'Timeline Photos') {
                        select.append($('<option/>',
                        {
                            value: albumData.id,
                            text: albumData.name
                        }));
                    };
                });

                albumId = $('#Albums').val();

                Galleria.loadTheme('/Scripts/galleria/themes/classic/galleria.classic.min.js');
                Galleria.run('#galleria', {
                    facebook: 'album:' + albumId,
                    width: 960,
                    height: 550,
                    lightbox: true
                });

            });

            // Album changed
            $("#Albums").change(function () {
                albumId = $(this).val();

                Galleria.loadTheme('/Scripts/galleria/themes/classic/galleria.classic.min.js');
                Galleria.run('#galleria', {
                    facebook: 'album:' + albumId,
                    width: 960,
                    height: 550,
                    lightbox: true
                });
            });

        });
    </script>
